/* 占位盒子 */
.seize {height: 70px;display: none;}
/* 动画效果 */
@keyframes move {from{transform: scale(1);}to{transform: scale(1.2);}}
/* SVG 圆圈加载*/
.technology svg {transform: rotate(-90deg);}
.technology .progress {stroke-dashoffset:0px;stroke-dasharray:345px;}
.technology .progress.active1{animation: rotate1 1500ms linear both;}
.technology .progress.active2{animation: rotate2 1500ms linear both;}
.technology .progress.active3{animation: rotate3 1500ms linear both;}
.technology .progress.active4{animation: rotate4 1500ms linear both;}
.technology .progress.active5{animation: rotate5 1500ms linear both;}
.technology .progress.active6{animation: rotate6 1500ms linear both;}
@keyframes rotate1 {from {stroke-dashoffset: 345px;}to {stroke-dashoffset: 17px;}}
@keyframes rotate2 {from {stroke-dashoffset: 345px;}to {stroke-dashoffset: 34px;}}
@keyframes rotate3 {from {stroke-dashoffset: 345px;}to {stroke-dashoffset: 34px;}}
@keyframes rotate4 {from {stroke-dashoffset: 345px;}to {stroke-dashoffset: 34px;}}
@keyframes rotate5 {from {stroke-dashoffset: 345px;}to {stroke-dashoffset: 34px;}}
@keyframes rotate6 {from {stroke-dashoffset: 345px;}to {stroke-dashoffset: 34px;}}

/* 公共样式 */
.ant-back-top-content {background-color: rgba(0, 0, 0, 0.6);}
.con {width: 1200px;margin: 0 auto;}
.pubTit h1{text-align: center;font-size: 30px;line-height: 30px;color: #2c3e50;position: relative;padding:0 0 10px;}
.pubTit h1:after {position: absolute;content: "";background: #E87E04;width:70px;height: 4px;bottom: 0;left: 50%;margin-left: -35px;}
/* banner */
.banner {position: relative;width: 100%;}
.banner .swiper-slide img{width: 100%;height: 100vh; object-fit: cover;z-index: 1;}
.banner .swiper-slide img.ontrue{animation: move 5s linear;}
.banner .swiper-slide:after{position: absolute;content: ""; width: 100%;height: 100%;top: 0;left: 0;background: rgba(255, 255, 255, .4);}
.banner .banText{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);z-index: 2;text-align: center;}
.banText h1{font-size: 70px;color: #2c3e50;font-family: cursive,'Lato', sans-serif;font-weight: 400;}
.banText p{font-size: 30px;color: #2c3e50;}
.banText span{display: inline-block;width: 150px;height: 50px;line-height: 48px;font-size: 16px;border: 1px solid;border-radius: 5px;cursor: pointer;margin: 5px;background: rgba(256,256,256,0.8);color: #2c3e50;}
.banText span:hover {background: #2c3e50;color: #fff;border-color:#2c3e50;}

/* nav */
.nav {width: 100%;background: #2c3e50;color: #f5f5f5;height: 70px;position: relative;z-index: 9999;}
.nav .navTit {line-height: 70px;float: left;color: #fff;font-size: 14px;font-weight: bold;}
.nav .navTit a:hover{color: #E87E04;}
.nav .navList{float: right;}
.nav .navList li{float: left;line-height: 70px;padding: 0 20px;cursor: pointer;}
.nav .navList li:hover,.nav .navList li.ontrue{color: #E87E04;}
.nav .navImg{display: none;float: right;line-height: 70px;cursor: pointer;}

/* 关于我 */
.aboMe {width: 100%;padding-top: 70px;}
.aboMe .aboMeImg {width: 100%;padding-top: 26px;text-align: center;}
.aboMe .aboMeImg img{width: 200px;height: 200px;border-radius: 50%;object-fit: cover;}
.aboMe .aboMeWd {width: 100%;padding-top: 26px;}
.aboMe .aboMeWd p{font-size: 16px;}
.aboMe .aboMeWd p:first-child{text-indent: 2em;}
.aboMe .aboMeWd p a{color: #40a9ff;}
.aboMe .aboMeWd p a:hover {text-decoration: underline;}

/* 求职意向 */
.job {width: 100%;padding-top: 70px;}
.jobList {text-align: center;padding-top: 30px;}
.jobList .jobImg {width: 100%;display: flex;justify-content: center;align-content: center;}
.jobList .jobImg img{max-width: 100%;max-height: 100%;object-fit: cover;}
.jobList .jobWd p{padding: 0 6px;}
.jobList .jobWd h5{color: #E87E04;font-size: 16px;padding: 14px 0;font-weight: bold;}

/* 作品集 */
.works{width: 100%;padding-top: 70px;}
.worksList {width: 100%;padding-top: 30px;margin-top: -20px;}
.worksList{margin-top: -26px;}
.worksList .gutter-box {position: relative;margin-top: 26px;}
.worksList .gutter-box a:hover{color: inherit;}
.worksList .gutter-box a:hover .worksListWd{opacity: 1;}
.worksList .gutter-box a:hover .worksListImg img{transform: scale(1.06);}
.worksList .worksListImg {width: 100%;overflow: hidden;}
.worksList .worksListImg img{transition: all .4s ease; max-width: 100%;max-height: 100%;object-fit: cover;}
.worksList .worksListWd {transition: all .4s ease; position: absolute;width: 100%;height: 100%;background: rgba(0, 0, 0, .6);top: 0;left: 0;text-align: center; color: #fff;display: flex;justify-content: center;align-items: center;flex-wrap: wrap;opacity: 0;}
.worksList .worksListWd h5{font-weight: bold;font-size: 16px;color: #fff;width: 100%;padding: 0 6px;}
.worksList .worksListWd p{width: 100%;padding: 0 20px;}
.worksList .worksListWd img{width: 30px;height: 30px;object-fit: cover;}

/* 技术掌握 */
.technology {width: 100%;padding-top: 70px;}
.technology .ant-row{padding-top: 30px;margin-top: -24px;}
.technology .gutter-row {margin-top: 24px;}
.technology .gutter-box {text-align: center;position: relative;}
.technology .gutter-box .technologyWd {font-size: 24px; position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);margin-top: -18px;color: #2c3e50;}
.technology .gutter-box h5{color: #E87E04;font-size: 16px;margin-top: 10px;}

/* 我的经历 */
.experience {width: 100%;padding-top: 70px;}
.experienceList {width: 100%;padding-top: 30px;margin-top: -24px;}
.experienceList .experienceBox {margin-top: 24px;position: relative;min-height: 110px;}
.experienceBox .experienceListLeft {float: left;width: 50%;text-align: right;padding-right: 100px;}
.experienceBox .experienceListLeft.ontrue {float: right;text-align: left;padding-right: 0;padding-left: 100px;}
.experienceBox .experienceListLeft.ontrue p{float: none;}
.experienceBox .experienceListRight {position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);width: 110px;height: 110px;border-radius: 50%;text-align: center;padding-top: 20px;border: 1px solid #787978;}
.experienceBox .experienceListRight p{font-size: 16px;color: #787978;font-family: \5FAE\8F6F\96C5\9ED1;font-weight: bold;}
.experienceBox .experienceListLeft h1{color: #626e7c;font-size: 16px;font-weight: bold;}
.experienceBox .experienceListLeft h5{color: #E87E04;font-size: 16px;}
.experienceBox .experienceListLeft p{color: #787978;font-size: 14px;max-width: 57%;float: right;}

/* 联系我 */
.contact {width: 100%;padding: 100px 0;}
.contactText {margin-top: 30px;}
.contactTextLeft {float: left;width: 49%;text-align: right;}
.contactTextRight {float: right;width: 49%;text-align: left;}
.contactText p{font-size: 16px;margin-top: 10px;}



@media all and (max-width:1599px) {
  /* 1440 × (900/1050) */
    .banText h1{font-size: 40px;}
    .banText p{font-size: 26px;}
}

@media all and (max-width:1439px) {
    /* 1360 × (768) */
    .con {width: 92%;}
}

@media all and (max-width:1279px) {
    /* 1152 × (864) */
    .banText p{font-size: 20px;}
}

@media all and (max-width:1151px) {
    /* 1024 × (600/768) */
    
}


/* ------------------------手机端-------------------------- */
@media all and (max-width:1000px) {
    /* 平板设备 720 适配 */
    .banText h1{font-size: 30px;}
    .nav .navList li {padding: 0 10px;}
    .pubTit h1{font-size: 24px;}
    .pubTit h1:after{width: 60px;margin-left: -30px;height: 3px;}
    .aboMe .aboMeWd p{font-size: 14px;}
    .jobListCol {margin-top: 20px;}
    .experienceBox .experienceListLeft{float: left;width: 50%;text-align: left;padding-right: 0;}
    .experienceBox .experienceListLeft p{float: none;max-width: 80%;}
    .experienceBox .experienceListRight{position: initial;top: 0;left: 0;-webkit-transform: translate(-50%,-50%);transform: none;float: left;margin: 0 10% 0 20%;}
    .experienceBox .experienceListLeft.ontrue{padding-left: 0;float: left;}
}
@media all and (max-width:640px) {
    /* 移动终端以上 360 适配 */
    .banText h1{font-size: 24px;}
    .banText p{font-size: 15px;}
    .banText span {width: 120px;height: 40px;line-height: 38px;font-size: 14px;}
    .nav .navImg{display: block;}
    .nav .navList {display: none;position: absolute;top: 70px;width: 100%;left: 0;background: #2c3e50;}
    .nav .navList li{float: none;width: 100%;padding: 0;line-height: 42px;text-align: center;}
    .aboMe,.job,.works,.technology,.experience,.contact{padding: 30px 0;}
    .jobList {padding-top: 0;}
    .worksList .worksListWd {opacity: 1;}
    .worksList .worksListWd p{display: none;}
    .experienceBox .experienceListRight {float: none;margin: 0 auto;}
    .experienceBox .experienceListLeft{float: none;width: 100%;text-align: center;margin-top: 14px;}
    .experienceBox .experienceListLeft p{max-width: 90%;margin: 0 auto;}
    .experienceBox .experienceListLeft.ontrue{padding-left: 0;float: none;text-align: center;}
    .contactTextLeft{width: 43%;}
    .contactTextRight{width: 57%;}
}